# Pagination

## Installation
`npm i @snack-uikit/pagination`

## TODO

- обновить цвета pagination slider после переработки палитры
- подумать о семантике кнопок навигации (возможно, использовать ссылки вместо кнопок и добавлять на них href)
- пересмотреть механизм переключения страницы при нажатие на многоточие

## Example

```typescript jsx
import { Pagination, PaginationSlider } from "@snack-uikit/pagination";

function App() {
  const [page, setPage] = useState(args.page);

  return (
    <>
      <Pagination page={page} onChange={setPage} total={10}/>
      <PaginationSlider page={page} onChange={setPage} total={10}/>
    </>
  );
}
```

[Changelog](./CHANGELOG.md)

[//]: DOCUMENTATION_SECTION_START
[//]: THIS_SECTION_IS_AUTOGENERATED_PLEASE_DONT_EDIT_IT
## Pagination
### Props
| name | type | default value | description |
|------|------|---------------|-------------|
| onChange* | `(page: number) => void` | - | Колбек смены значения |
| page* | `number` | - | Текущая страница |
| total* | `number` | - | Общее количество страниц |
| className | `string` | - | CSS класснейм |
| size | enum Size: `"xs"`, `"s"` | s | Размер |
## PaginationSlider
### Props
| name | type | default value | description |
|------|------|---------------|-------------|
| onChange* | `(page: number) => void` | - | Колбек смены значения |
| page* | `number` | - | Текущая страница |
| total* | `number` | - | Общее количество страниц |
| className | `string` | - | CSS класснейм |


[//]: DOCUMENTATION_SECTION_END

